<template>
  <div>
    <myTable :arr="list">
      <!-- <template #default="scope">
        default 表示插槽的默认名字(slot没有指定name属性的时候的名字) -->
      <template v-slot="scope">
        {{ scope.row.headImgUrl }}
      </template>
    </myTable>

    <myTable :arr="list">
      <template v-slot="scope">
        <img :src="scope.row.headImgUrl" alt="">
      </template>
    </myTable>
  </div>
</template>

<script>
import myTable from "./components/myTable.vue"
export default {
  components: {myTable},
  data(){
    return {
      list: [
          {
              name: "小传同学",
              age: 18,
              headImgUrl:
              "http://yun.itheima.com/Upload/./Images/20210303/603f2d2153241.jpg",
          },
          {
              name: "小黑同学",
              age: 25,
              headImgUrl:
              "http://yun.itheima.com/Upload/./Images/20210304/6040b101a18ef.jpg",
          },
          {
              name: "智慧同学",
              age: 21,
              headImgUrl:
              "http://yun.itheima.com/Upload/./Images/20210302/603e0142e535f.jpg",
          },
      ],
    }
  }
}
</script>

<style>

</style>